/*cI4u54VYZVPxnvGrX5EL6HXX6+tBhMNbry4zRW5Uf2RuXYfnoeOdBS4xA3fBBRYR*/
import React, { Component } from 'react';
import { base, high } from 'nc-lightapp-front';
import {
	buttonClick,
	initTemplate,
	bodyAfterEvent,
	headAfterEvent,
	headBeforeEvent,
	beforeEvent,
	pageInfoClick,
	saveAction,
	backToList,
	rowSelected,
	CommitAction,
	addRowAfter
} from './events';
import ampub from 'ampub';
const { components, utils } = ampub;
const { multiLangUtils, cardUtils, closeBrowserUtils, listUtils } = utils;
const { getTitleName } = listUtils;
const { getMultiLangByID } = multiLangUtils;
const { ApprovalTrans } = components;
const { createCardTitleArea, createCardPaginationArea, getCommonTableHeadLeft, creatCardSocket } = cardUtils;
const { NCAffix, NCDiv } = base;
const { BillTrack, ApproveDetail } = high;
/**
 * 转固
 * wangwhf
 * 2018/08/08
 */
class Card extends Component {
	constructor(props) {
		super(props);
		this.is_allow_dept_midlev = false; //是否允许部门非末级(组织级数据)
		this.state = {
			// 单据追溯
			trackshow: false,
			pk_bill: this.props.getUrlParam('id'),
			// 审批详情
			showApprove: false,
			transi_type: '',
			compositedisplay: false,
			compositedata: {}
		};
		// 放置财务组织本位币种，用于增行赋值
		this.currency = {
			value: '',
			display: ''
		};
		closeBrowserUtils.call(this, props, {
			form: [ props.pageConfig.formId ],
			cardTable: [ props.pageConfig.tableId ]
		});
		initTemplate.call(this, props);
	}
	componentDidMount() {}
	//获取列表肩部信息
	getTableHeadLeft = () => {
		return getCommonTableHeadLeft.call(this, this.props);
	};
	//获取列表肩部信息
	getTableHead = () => {
		let { button } = this.props;
		let { createButtonApp } = button;
		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons">
					{createButtonApp({
						area: 'card_body',
						buttonLimit: 4,
						onButtonClick: buttonClick.bind(this),
						popContainer: document.querySelector('.header-button-area')
					})}
				</div>
			</div>
		);
	};
	//提交及指派 回调
	getAssginUsedr = (value) => {
		CommitAction.call(this, this.props, 'SAVE', 'commit', value);
	};
	//取消 指派
	turnOff = () => {
		this.setState({
			compositedisplay: false
		});
	};
	render() {
		let { cardTable, form, button, ncmodal, ncUploader, pageConfig } = this.props;
		let { formId, pagecode, tableId, title, dataSource, bill_type } = pageConfig;
		let { createNCUploader } = ncUploader;
		let { createForm } = form;
		let { createCardTable } = cardTable;
		let { createButtonApp, createErrorFlag } = button;
		let { createModal } = ncmodal;
		return (
			<div id="nc-bill-card" className="nc-bill-card">
				<div className="nc-bill-top-area">
					<NCAffix>
						<NCDiv areaCode={NCDiv.config.HEADER} className="nc-bill-header-area">
							{/* 标题 title */}
							<div className="header-title-search-area">
								{createCardTitleArea.call(this, this.props, {
									title: getTitleName.call(this, this.props),
									formId,
									backBtnClick: backToList
								})}
							</div>
							<div className="header-button-area">
								{/* 创建重试、回退等 saga 控制按钮 */}
								{createErrorFlag({
									headBtnAreaCode: 'card_head',
								})}
								{createButtonApp({
									area: 'card_head',
									buttonLimit: 4,
									onButtonClick: buttonClick.bind(this),
									popContainer: document.querySelector('.header-button-area')
								})}
							</div>
							{createCardPaginationArea.call(this, this.props, {
								formId,
								dataSource,
								pageInfoClick
							})}
						</NCDiv>
					</NCAffix>
					<div className="nc-bill-form-area">
						{createForm(formId, {
							onAfterEvent: headAfterEvent.bind(this),
							onBeforeEvent: headBeforeEvent.bind(this)
						})}
					</div>
				</div>
				<div className="nc-bill-bottom-area">
					<div className="nc-bill-table-area">
						{createCardTable(tableId, {
							tableHeadLeft: this.getTableHeadLeft.bind(this),
							tableHead: this.getTableHead.bind(this),
							modelSave: saveAction.bind(this),
							onAfterEvent: bodyAfterEvent.bind(this),
							onBeforeEvent: beforeEvent.bind(this),
							showIndex: true,
							showCheck: true,
							isAddRow: true,
							adaptionHeight: true,
							selectedChange: rowSelected.bind(this),
							addRowCallback: addRowAfter.bind(this, this.props)
						})}
					</div>
				</div>
				{/* 确认取消框 */}
				{createModal('confirm', { color: 'warning' })}
				{/* 单据追溯 */}
				<BillTrack
					show={this.state.trackshow}
					close={() => {
						this.setState({ trackshow: false });
					}}
					pk={this.state.pk_bill}
					type={bill_type}
				/>
				{/* 审批详情 */}
				<ApproveDetail
					show={this.state.showApprove}
					close={() => {
						this.setState({ showApprove: false });
					}}
					billtype={this.state.transi_type}
					billid={this.state.pk_bill}
				/>
				{/* 附件*/}
				{createNCUploader('uploader', {})}
				{/* 提交及指派 */}
				{this.state.compositedisplay && (
					<ApprovalTrans
						title={getMultiLangByID('amcommon-000002')} // 国际化：指派
						data={this.state.compositedata}
						display={this.state.compositedisplay}
						getResult={this.getAssginUsedr}
						cancel={this.turnOff}
					/>
				)}
				{/* 创建 socket 链接 */}
				{creatCardSocket.call(this, this.props, {
					headBtnAreaCode: 'card_head', // 按钮区域编码,用于平台内部更新按钮状态
					formAreaCode: formId, //表单区域编码, 用于平台内部更新表头数据
					onMessage: (props, msg) => { //监听消息
						// 仅处理自己的按钮显示控制，重试和回退按钮有平台处理
						if (msg.error) {
							// 补充事务存在异常时，页面要显示的按钮控制逻辑
							// 由需求定义保留显示按钮逻辑
							// 单据追溯和刷新比较重要，需要显示
						} else {
							// 事务通过重试或回退方式成功时，要恢复按钮显示控制逻辑
						}
					},
					billtype: pageConfig.bill_type, //单据类型, 用于查询追溯
					billpkname: pageConfig.pkField, //单据主键名, 用于查询追溯
				})}
			</div>
		);
	}
}

export default Card;
export { initTemplate };

/*cI4u54VYZVPxnvGrX5EL6HXX6+tBhMNbry4zRW5Uf2RuXYfnoeOdBS4xA3fBBRYR*/